<template>
  <div>
    <!-- 搜索 -->
    <!-- 特殊配件管理费率维护 -车厂-->
    <!-- <TopFilter ref="topfilter" :list="topFilterList" :cols="4" labelWidth="110" :collapse="true" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter> -->

    <TopFilter ref="TopFilterss" :list="topFilterInit" :cols="2" :collapse="collapse" labelWidth="90" @filterChange="changeHandle"></TopFilter>
    <!-- table -->
    <FilterTable
      ref="table"
      :columns="columns"
      :params="fetchParams"
      :fetchapi="fetchapi"
      :datakey="'records'"
      :onColumnsChange="(columns) => (this.columns = columns)"
      :onRowSelectChange="selectChange"
    >
      <template slot="controls">
        <multiuse-button size="small" type="primary" icon="el-icon-plus" @click="add()">新增</multiuse-button>
        <multiuse-button size="small" type="primary" :click="qiyong.bind()" :disabled="disableds">启用</multiuse-button>
        <multiuse-button size="small" type="primary" :click="tingyong.bind()" :disabled="disableds">停用</multiuse-button>
        <multiuse-button type="primary" :click="exportFileBtn.bind(this)">下载</multiuse-button>
        <a>下载</a>

        <!-- <multiuse-button size="small" type="primary"  :loading="exportLoading" :click="downloadTemplate.bind()">下载模板</multiuse-button> -->
        <!-- <multiuse-button size="small" icon="el-icon-upload" @click="showImportFun()" >导入</multiuse-button> -->
      </template>
    </FilterTable>
    <BaseDialog :visible.sync="visibleAdd" :title="'配套厂备件管理费率新增'" destroyOnClose width="850px" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <AddForm @close="closeAdd" @save="saveAdd"></AddForm>
    </BaseDialog>
    <BaseDialog :visible.sync="visibleEdit" :title="'配套厂备件管理费率编辑'" destroyOnClose width="850px" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <EditForm @close="closeEdit" @save="saveEdit" :rowData="rowData"></EditForm>
    </BaseDialog>
    <BaseDialog
      :visible.sync="showImport"
      icon="el-icon-upload"
      :closable="false"
      title="导入"
      width="800px"
      destroyOnClose
      :containerStyle="{ height: 'calc(100% - 120px)', overflow: 'auto', paddingBottom: '60px' }"
    >
      <importExcel @close="showImport = false" @importclose="editsave()" url="/api/cms_claimfac/rPSpMngRate/importExcel" />
    </BaseDialog>
  </div>
</template>
<script>
// import { dictionary } from '@/utils/dictMixin';
import Vehicle from '@/pages/claimDemage/tools/vehicle.vue';
import AddForm from './AddForm.vue';
import EditForm from './EditForm.vue';
import { getAppId } from '@/assets/js/auth';
// import importOrderParameterModel from './importOrderParameterModel.vue';
import importExcel from '@/pages/claimDemage/tools/importExcel.vue';
import {
  getListByPage,
  newSave,
  getListForExport,
  downloadModel,
  piliangqiyong,
  piliangtingyong,
  excelExport,
  getDealerList,
  editSave,
  exporturl,
  getModelList,
} from '@/api/claim/factory/SpePartManageHourMaintain';
import { dictionary } from '@/utils/dictMixin';
import { exportExcelFile } from '@/utils';

export default {
  mixins: [dictionary],
  components: {
    Vehicle,
    AddForm,
    EditForm,
    importExcel,
  },
  data() {
    return {
      disableds: true,
      dataList: [],
      visible: false,
      exportLoading: false,
      visibleDrawer: false,
      collapse: false,
      showImport: false,
      infoId: null,
      topFilterInit: this.topFilterInitFun(),
      flterValue: {}, //参数
      columns: this.creatHeader(),
      fetchapi: getListByPage,
      fetchParams: {}, //ipa 接口
      selectedRows: [], //选中经销商
      dialogTitle: '配件选择',
      visibleAdd: false,
      rowData: {},
      visibleEdit: false,
      queryParam: {},
      ModelList: [],
    };
  },
  created() {
    // if(getAppId()=='beijing'){
    //   this.topFilterInit.find((x) => x.fieldName == 'powerType').itemList = this.createDictList('6008');
    // }else{
    //   this.topFilterInit.find((x) => x.fieldName == 'powerType').itemList = this.createDictList('6008');
    //   this.topFilterInit.find((x) => x.fieldName == 'powerType').initialValue = 60081002;
    //   this.topFilterInit.find((x) => x.fieldName == 'powerType').disabled=true;
    // }
  },

  methods: {
    //选中
    selectChange(rows) {
      this.selectedRows = rows;
      this.disableds = this.selectedRows.length <= 0;
      console.log(this.selectedRows);
    },
    chooseOrderNo() {
      this.visible = true;
    },
    add() {
      this.visibleAdd = true;
    },
    edit() {
      this.visibleEdit = true;
    }, //批量启用
    async qiyong() {
      if (this.selectedRows.length > 0) {
        let str = '';
        this.selectedRows.map((x) => {
          str += x.mrId + ',';
        });
        console.log(str);
        const res = await piliangqiyong({ ids: str, status: '55981001' });
        this.fetchParams = { ...this.fetchParams };
        return this.$notify.success({ title: '提示信息', message: '操作成功' });
      } else {
        return this.$notify.warning({ title: '提示信息', message: '请勾选后再进行启用！' });
      }
    },
    //批量停用
    async tingyong() {
      if (this.selectedRows.length > 0) {
        let str = '';
        this.selectedRows.map((x) => {
          str += x.mrId + ',';
        });
        console.log(str);
        const res = await piliangtingyong({ ids: str, status: '55981002' });
        if (res.resultCode == 200) {
          this.fetchParams = { ...this.fetchParams };
          return this.$notify.success({ title: '提示信息', message: '操作成功' });
        }
      } else {
        return this.$notify.warning({ title: '提示信息', message: '请勾选后再进行停用！' });
      }
    },
    closeAdd() {
      this.visibleAdd = false;
    },
    saveAdd() {
      this.visibleAdd = false;
      this.fetchParams = { ...this.fetchParams };
    },
    closeEdit() {
      this.visibleEdit = false;
    },
    emitFun(val) {
      console.log(val);
      this.mrId = val['mrId'];
      this.rowData = val;
      this.visibleEdit = true;
    },
    saveEdit() {
      this.visibleEdit = false;
      this.fetchParams = { ...this.fetchParams };
    },
    // Excel更新导入
    showImportFun() {
      this.showImport = true;
    },
    //下载模板
    downloadTemplate() {
      this.$confirm('此操作将下载excel模板, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.exportLoading = true;
        downloadModel().then((res) => {
          console.log('666');
          console.log(res);
          exportExcelFile(res.data, '配套厂配件管理费率维护导入模板');
          this.exportLoading = false;
        });
      });
    },
    // 导出
    async exportFileBtn() {
      let params = { ...this.fetchParams };
      console.log(params, '导出::');
      let res = await getListForExport(params);
      console.log(res.data, '导出::');
      try {
        exportExcelFile(res.data, '配套厂备件管理费率信息');
      } catch (e) {
        console.log(e, '错误::');
      }
    },
    editsave() {
      this.showImport = false;
      this.fetchParams = { ...this.fetchParams };
    },
    //搜索获取数据
    changeHandle(val) {
      this.fetchParams = Object.assign({}, this.fetchParams, val);
      console.log(val);
    },
    //获取车型
    getCarData() {
      let arr = [];
      getModelList().then((res) => {
        if (res.data) {
          console.log(res.data);
          res.data.forEach(function (item, i) {
            if (item.modelCode) {
              arr.push({ text: item.modelName, value: item.modelCode });
            }
          });
          // debugger
          this.ModelList = arr;
        }
      });
      return arr;
    },
    //  getCarData1() {
    //     let arr = [];
    //     let tempArr =[];
    //     getModelList().then((res) => {
    //       if (res.data) {
    //         console.log(res.data);
    //         res.data.forEach(function (item, i) {
    //           if (item.modelCode) {
    //             arr.push({ text: item.modelName, value: item.modelCode});
    //              tempArr.push(item.modelCode);
    //           }
    //         });
    //         this.ModelList = arr;
    //       }
    //     });
    //     return arr;
    //   },
    //搜索数据
    topFilterInitFun() {
      return [
        { type: 'INPUT', label: '配套厂编码', fieldName: 'supplierCode', placeholder: '请输入配套厂编码...', initialValue: '' },
        { type: 'INPUT', label: '配套厂名称', fieldName: 'supplierName', placeholder: '请输入配套厂名称...', initialValue: '' },
        {
          type: 'SELECT',
          label: '状态',
          fieldName: 'status',
          placeholder: '请选择',
          initialValue: '',
          itemList: this.createDictList('5598'),
          // itemList:[],
          //rules: [{required: true, message: '请选择动力形式...', trigger: 'change'}]
        },
        {
          type: 'SELECT',
          label: '车型',
          fieldName: 'vehicleType',
          placeholder: '请选择',
          initialValue: '',
          itemList: this.getCarData(),
          width: 100,
        },
      ];
    },
    //table表头和数据源
    creatHeader() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          fixed: 'left',
          sorter: true,
          render: (props) => {
            return <span>{props.row.index + 1}</span>;
          },
        },
        {
          title: '操作',
          dataIndex: 'column-action',
          width: 80,
          render: (props) => {
            let editFlag = true;

            if ('55981002' == props.row.status) {
              //停用
              editFlag = false;
            }

            return (
              <div style="text-align:center">
                <multiuse-button type="text" disabled={editFlag} onClick={() => this.emitFun(props.row)}>
                  编辑
                </multiuse-button>
              </div>
            );
          },
        },
        {
          title: '状态',
          dataIndex: 'status',
          sorter: true,
          filterItems: this.createDictList(5598),
          render: (props) => {
            return <span>{this.createDictText(props.row.status, 5598)}</span>;
          },
        },
        { title: '配套厂编码', dataIndex: 'supplierCode', sorter: true },
        { title: '配套厂名称', dataIndex: 'supplierName', sorter: true },
        {
          title: '车型',
          dataIndex: 'modelName',
          sorter: true,
          width: 120,
          // filterItems:this.getCarData(),
          // filterItems: this.getCarData()

          // render: (props) => {
          //   // debugger
          //   this.ModelList.forEach((item) => {
          //     if (item.value === props.row.vehicleType)
          //        return <span>{item.text}</span>
          //      console.log(item.value,item.text,props.row.vehicleType)
          //   });
          // },
        },
        { title: '车型代码', dataIndex: 'vehicleType', sorter: true, hidden: true },
        { title: '编号', dataIndex: 'mrId', sorter: true, hidden: true },
        { title: '备件管理费率', dataIndex: 'manageRate', sorter: true },
        { title: '修改时间', dataIndex: 'updatedAt', sorter: true },
      ];
    },
  },
  // mounted() {
  //   this.BaseTable = this.$refs.listModal.$refs.pageTable;
  // }
};
</script>

<style lang="less" scoped></style>
